{extend name="default:layout:base" /}

{block name="main"}
<form class="layui-form" action="" method="post" style="padding-bottom: 60px;">
    {volist name="replies" id="reply"}
    <div class="layui-form-item">
        <label class="layui-form-label">{$events[$reply.event]}</label>
        <div class="layui-input-block js-choose-type" data-event="{$reply.event}">
            <input type="radio" {if $reply.status == 0} checked {/if}  name="{$reply.event}" value="status" title="不处理">
            <input type="radio" {notempty name="$reply['keyword']"} checked {/notempty} name="{$reply.event}" value="keyword" title="触发关键词" >
            <input type="radio" {notempty name="$reply['app_name']"} checked {/notempty} name="{$reply.event}" value="app_name" title="触发应用">
        </div>
    </div>

    <div id="tapNode{$reply.event}" class="{if $reply.status < 1}hide{/if}">
        <div class="layui-tab-content {$reply.event}">
            <!--关键词-->
            <div class="{$reply.event}_keyword layui-tab-item {notempty name="$reply['keyword']"} layui-show {/notempty}">
                <div class="layui-form-item">
                    <label class="layui-form-label"></label>
                    <div class="layui-input-block">
                        <input type="text" name="{$reply.event}_keyword" value="{$reply['keyword']}" placeholder="请输入关键词" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
            <!--触发应用-->
            <div class="{$reply.event}_app_name layui-tab-item {notempty name="$reply['app_name']"} layui-show  {/notempty}">
                <div class="layui-form-item">
                    <label class="layui-form-label"></label>
                    <div class="layui-input-block">
                        <select name="{$reply.event}_app">
                            <option value="">请选择应用</option>
                            {volist name="apps" id="v"}
                            <option {if $reply.app_name == $v.name} selected {/if}  value="{$v.name}">{$v.title}</option>
                            {/volist}
                        </select>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {/volist}

    <div id="form-btn-group">
        <button class="layui-btn layui-btn-normal" lay-submit lay-filter="special">立即提交</button>
        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
</form>
{/block}

{block name="js"}
<script>
    layui.use(['form', 'jquery'], function(){
        let form = layui.form
                , $ = layui.jquery;

        $(".js-choose-type").click(function(){
            let event = $(this).data('event');
            let type = $("input[name='"+event+"']:checked").val();
            let class_a = event + '_'+ type;
            if(type === 'status'){
                $('#tapNode'+event).addClass('hide');
            }else{
                $('#tapNode'+event).removeClass('hide');
            }
            $('.'+event+' div').removeClass('layui-show');
            $('.'+class_a).addClass('layui-show')
        });

        //监听提交
        form.on('submit(special)', function(data){
            requestPost('', data.field, function () {
                var parent_index = parent.layer.getFrameIndex(window.name);
                parent.layer.close(parent_index);
            });
            return false;
        });
    });
</script>
{/block}